<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../../jquery-3.3.1.js"></script>
</head>

<body>

    <script>
        (function () {
            // jquery1.5之前写法
            var ajax = $.ajax({
                url: './data.json',
                success: function () {
                    console.log('success 1');
                    console.log('success 2');
                    console.log('success 3');
                }
            })

            // 1.5之后的写法 因为引入了deferred 思想  对异步调用有了更好的支持
            // 实行开发封闭原则 对扩展开发对修改封闭
            // 当要继续扩展方法时继续往下添加done或fail即可
            $.ajax('./data.json').done(function () {
                console.log("success 100")
            }).fail(function () {
                console.log("fail 100");
            }).done(function () {
                console.log("success 200");
            }).fail(function () {
                console.log("fail 200");
            })

            // 或者类似于promise 写法 传入两个回调函数 一个是成功回调 一个是失败回调
            $.ajax('./data.json').then(function () {
                console.log("success a");
            }, function () {
                console.log("fail a")
            }).then(function () {
                console.log("success b");
            }, function () {
                console.log("fail b")
            })
        })();
    </script>

</body>

</html>